<template>
	<div class="tab-own">
		<!-- 选项 【数据 | 】 -->
		<a href="">图示IMG/LINK</a>
		<div class="flex sp-arround">
			<modelTab :title="dataT" :data="dataD"/>
			<modelTab :title="domT" :data="domD"/>
			<modelTab :title="sourceT" :data="sourceD"/>
			<modelTab :title="combinationT" :data="combinationD"/>
			<modelTab :title="ohterT" :data="ohterD"/>
			<!-- <modelTab :title="" :data=""/> -->
		</div>
	</div>
</template>

<script>
import modelTab from './child/modelTab'
export default {
	components: { modelTab },
	data() {
		return {
			showI: 0,
			dataT: '选项 / 数据',
			dataD: [
				'data', 'props', 'propsData',
				'computed', 'methods', 'watch',
			],
			
			domT: '选项 / DOM',
			domD: [
				'el', 'template', 'render', 'renderError'
			],

			sourceT: '选项 / 资源',
			sourceD: [
				'directives', 'filters', 'components'
			],

			combinationT: '选项 / 组合',
			combinationD: [
				'parent', 'mixins', 'extends',
				'provide / inject',
			],

			ohterT: '选项 / 其它',
			ohterD: [
				'name', 'delimiters', 'functional',
				'model', 'inheritAttrs', 'comments',
			],

			// T: '选项 / ',
			// D: [
			// 	'', '', '',
			// 	'', '', '',
			// ],
			// I -> Introduce
		}
	},
	methods: {

	}
}
</script>

<style lang="scss" scoped>

</style>